library(shiny)

# Tab for the scatter plot output
sct_plot <- tabPanel(
    "Scatter plot",
    # Div for the scatter plot
    tags$div(id = "scatterplot_area"),

    # table for selected elements
    tags$div(id = "table",
             tags$table(
                      tags$tr(
                               tags$th("Agente Causador"),
                               tags$th("Hora"),
                               tags$th("Idade")
                           )
                  )
             )
)

# Tab for tree
#tree <- tabPanel(
#    "Tree",
#    #Div for the tree
#    tags$div(id = "tree_area")
#)

# Tab for dendrogram
dendrogram <- tabPanel(
    "Dendrogram",
    #Div for the tree
    tags$div(id = "dendrogram_area")
)

# Tab for a Treemap
#treemap <- tabPanel(
#    "TreeMap",
#    # Div for the bar chart
#    tags$div(id = "treemap_area")
#)

# Tab choropleth
choropleth <- tabPanel(
    "Choropleth",
    # Div for the bar chart
    tags$div(id = "choropleth_area")
)
# Tab for a Treemap
treemap2 <- tabPanel(
    "TreeMap",
    # Div for the bar chart
    tags$div(id = "treemap2_area")
)

# main content UI layout
body <- mainPanel(

    tabsetPanel(
        sct_plot,
#        tree,
        dendrogram,
#        treemap,
        choropleth,
        treemap2
    )

)

# Combine different UI elements to form app
ui <- fluidPage(

    tags$head(tags$link(rel = "stylesheet", type = "text/css", href = "style.css"),
              tags$script(src="d3.js"),
              tags$script(src="polybrush.js"),
              tags$script(src="adjust-screen.js"),
              tags$script(src="scatterplot.js"),
#              tags$script(src="tree.js"),
              tags$script(src="dendrogram.js"),
#              tags$script(src="treemap.js"),
              tags$script(src="choropleth.js"),
              tags$script(src="treemap2.js")),
              #tags$script(src="http://d3js.org/d3.v5.min.js"),

    body

)
